﻿@namespace Microsoft.FluentUI.AspNetCore.Components
@inherits FluentNavBase
@using Microsoft.AspNetCore.Components.Rendering
@using Microsoft.AspNetCore.Components.Routing
@inject NavigationManager NavigationManager

@if (Owner == null || Owner.Expanded || (HasIcon && (!Owner.CollapsedChildNavigation || SubMenu == null)))
{
    <div id="@Id" @attributes="AdditionalAttributes" class="@ClassValue" disabled="@Disabled" style="@Style" role="menuitem">
        @if (!OnClick.HasDelegate && Href is not null)
        {
            <NavLink class="@LinkClassValue"
                     @attributes="@Attributes"
                     Match="@Match"
                     ActiveClass="@ActiveClass"
                     title="@Tooltip"
                     onclick="@CustomToggleCode">
                <div class="positioning-region">
                    <div class="content-region">
                        @_renderContent
                    </div>
                </div>
            </NavLink>
        }
        else
        {
            <div class="positioning-region" title="@Tooltip">
                <div class="content-region">
                    <div class="@LinkClassValue" @onclick="OnClickHandlerAsync">
                        @_renderContent
                    </div>
                </div>
            </div>
        }
    </div>
}
else if (!Owner.Expanded && Owner.CollapsedChildNavigation && SubMenu != null)
{
    <FluentMenuItem Disabled="@Disabled" OnClick="OnClickHandlerAsync" @onmenuchange="async ev => await OnClickHandlerAsync(new MouseEventArgs())">
        <NavLink class="@LinkClassValue"
                    @attributes="@Attributes"
                    Match="@Match"
                    ActiveClass="@ActiveClass"
                    title="@Tooltip">
            @ChildContent
        </NavLink>

        @if (Icon is not null)
        {
            <span slot="start">
                <FluentIcon Value="@Icon" Color="@IconColor" CustomColor="@CustomColor" Class="fluent-nav-icon" />
            </span>
        }
    </FluentMenuItem>
}

@code {
    private void RenderContent(RenderTreeBuilder __builder)
    {
        @if (Icon is not null)
        {
            <FluentIcon Value="@Icon" Width="20px" Color="@IconColor" CustomColor="@CustomColor" Class="fluent-nav-icon" />
        }
        else
        {
            <span class="fluent-nav-icon" style="min-width: 20px;"></span>
        }
        <div class="fluent-nav-text @(Disabled ? "disabled" : "")">
            @ChildContent
        </div>
    }
}
